<!DOCTYPE html>
<html lang="en">
<head>
    <title>404 - LightStar</title>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="/static/asset/bootstrap/4.0.0/css/bootstrap.css">
    <!-- Lightstar theme -->
    <link rel="stylesheet" href="/static/css/boot.css">
    <link rel="stylesheet" href="/static/css/main.css">
</head>

<body>
<div class="container" style="text-align: center;">
    <div name="404" class="card error">
        <div class="card-header">
            <div style="color: firebrick;">
                <strong>SORRY! PAGE NOT FOUND.</strong>
            </div>
        </div>
        <div class="card-body">
            <div>
                <p>Something has triggered missing webpage on your website.
                    This is the default 404 error page for<strong>lightstar</strong>
                    It is located<tt>lightstar/static/404.html</tt>
                </p>
            </div>
        </div>
    </div>
</div>
<!-- Context menu -->
<div class="dropdown-menu contextmenu">
    <a id="refresh" class="dropdown-item" href="#" onclick="javascript:window.location.reload();">Refresh</a>
    <div class="dropdown-divider"></div>
    <a id="back" class="dropdown-item" href="#" onclick="javascript:window.history.back();">Go back</a>
    <a id="back" class="dropdown-item" href="#" onclick="javascript:window.history.forward();">Go forward</a>
    <div class="dropdown-divider"></div>
    <a id="home" class="dropdown-item" href="#" onclick="javascript:window.open('..', '_self')">Go home</a>
</div>

<!-- JQuery Javascript -->
<script src="/static/asset/jquery-1.12.4.js"></script>
<script src="/static/asset/popper.js/1.12.9/umd/popper.js"></script>
<!-- Bootstrap Javascript -->
<script src="/static/asset/bootstrap/4.0.0/js/bootstrap.js"></script>

<script type="module">
    $(function() {
        // register context menu.
        $(document).on("contextmenu", function (e) {
            $('.contextmenu').css("left", e.clientX);
            $('.contextmenu').css("top", e.clientY);
            $('.contextmenu').show();
            return false;
        });
        $(document).on("click", function (e) {
            $('.contextmenu').hide();
        });
    });
</script>
</body>
</html>